<template>
  <div class="container">
    <div>
      <el-row :gutter="12">
        <el-col :span="6">
          <el-form ref="form" :model="form">
            <el-form-item label="开始日期：">
              <el-date-picker
                v-model="form.StartDate"
                type="date"
                placeholder="选择日期"
                value-format="yyyy-MM-dd"
              ></el-date-picker>
            </el-form-item>
          </el-form>
        </el-col>
        <el-col :span="6">
          <el-form ref="form" :model="form">
            <el-form-item label="结束日期：">
              <el-date-picker
                v-model="form.EndDate"
                type="date"
                placeholder="选择日期"
                value-format="yyyy-MM-dd"
              ></el-date-picker>
            </el-form-item>
          </el-form>
        </el-col>
        <el-col :span="6">
          <el-form ref="form" :model="form" style="float: left">
            <el-button size="mini" type="primary" @click="getlistdata"
              >查 询</el-button
            >
            <!-- <el-button size="mini" type="success" @click="exportExcel">导 出</el-button> -->
          </el-form>
        </el-col>
      </el-row>
    </div>
    <el-table
      v-loading="loading"
      :data="
        tableData.slice((currentPage - 1) * pageSize, currentPage * pageSize)
      "
      highlight-current-row
    >
      <el-table-column
        prop="ID"
        label="序号"
        align="center"
      ></el-table-column>
      <!-- <el-table-column
        prop="REMARK"
        label="详情描述"
        align="center"
        width="150"
      ></el-table-column> -->
      <el-table-column
        prop="ROADNAME"
        label="道路名称"
        align="center"
        width="150"
      ></el-table-column>
      <el-table-column
        prop="ORIENTATION_TIME"
        label="时间"
        align="center"
        width="250"
      ></el-table-column>
      <el-table-column
        prop="LOCATION"
        label="位置"
        align="center"
        width="250"
      ></el-table-column>
      <el-table-column
        prop="REMARK"
        label="详情描述"
        align="center"
        width="450"
      ></el-table-column>
      <el-table-column label="图片"  align="center">
        <template slot-scope="scope">
          <el-image
            style="width: 40px; height: 40px; margin-top: 12px;"
            :src="scope.row.PHOTO1"
            @click="bigImage(scope.row)"
          ></el-image>
        </template>
      </el-table-column>
       <!-- <el-table-column
        prop="STATUS"
        label="状态"
        align="center"
      ></el-table-column> -->
      <el-table-column label="播放" width="250">
        <template slot-scope="scope">
          <el-button v-if="scope.row.RecordPath"
            type="text"
            icon="el-icon-headset"
            @click="openRecording(scope.$index, scope.row)"
            >播放录音</el-button
          >
          <el-button v-if="scope.row.VideoPath"
            type="text"
            icon="el-icon-video-play"
            @click="playVideo(scope.$index, scope.row)"
            >播放视频</el-button
          >
        </template>
      </el-table-column>
      <el-table-column label="操作"  align="center" width="250">
        <template slot-scope="scope"><el-button type="text" @click="handleAdd(scope.$index, scope.row)"
            >调度指导</el-button
          >
          <el-button type="text" @click="guidanceRecord(scope.$index, scope.row)"
            >指导记录</el-button
          >
          <el-button type="text" @click="rectificationRecord(scope.$index, scope.row)"
            >结果反馈</el-button
          >
        </template>
      </el-table-column>
    </el-table>
    <div class="pagination">
      <el-pagination
        background
        layout="total, sizes, prev, pager, next, jumper"
        :current-page="currentPage"
        :page-size="pageSize"
        :total="tableData.length"
        @size-change="handleSizeChange"
        @current-change="handlePageChange"
      ></el-pagination>
    </div>
    <el-dialog
      title="图片展示"
      :visible.sync="showBigDialogVisible"
      width="450px"
    >
      <el-carousel :interval="5000" arrow="always">
        <el-carousel-item v-for="item in imageList" :key="item">
          <img :src="item" style="height: 100%; width: 100%" alt="图片丢失了" />
        </el-carousel-item>
      </el-carousel>
    </el-dialog>
    <el-dialog
      title="视频展示"
      :visible.sync="showVideoDialogVisible"
      width="450px"
    >
      <video
        id="videoSource"
        style="width: 100%; height: 500px"
        :src="videoPath"
        controls="controls"
      >
        您的浏览器不支持 video 标签。
      </video>
      <!-- <video :ref="'videoPlayer' + index" :controls="isIn">
        <source :src="item.src" type="video/mp4" />
        您的浏览器不支持Video标签。
      </video>
      <i
        v-show="!isPlay"
        class="play-btn el-icon-video-play"
        @click="playVideo"
      ></i>
      <i
        v-show="isPlay && isIn"
        class="play-btn el-icon-video-pause"
        @click="pauseVideo"
      ></i> -->
    </el-dialog>

    <!-- 指导记录 -->
    <el-dialog title="指导记录" :visible.sync="showGuidanceVisible">
          <div>
            <el-row :gutter="1">
              <el-col :span="5">
                <el-form ref="form" :model="form" label-width="5.729vw">
                  <el-form-item label="接收班组长：">
                    <el-input v-model="form.name" placeholder="请输入姓名" style="width:150px;"></el-input>
                  </el-form-item>
                </el-form>
              </el-col>
              <el-col :span="8">
                <el-form ref="form" :model="form" style="float:right">
                  <el-form-item>
                    <el-button size="mini" type="primary" @click="screeningData">查 询</el-button>
                    <el-button size="mini" type="success" @click="handleAdd">添加指导</el-button>
                    <!-- <el-button size="mini" type="warning" @click="exportExcel">导 出</el-button> -->
                  </el-form-item>
                </el-form>
              </el-col>
            </el-row>
          </div>
      <div>
        <el-tabs type="border-card" style="min-height: 350px">
            <el-table :data="commandData" style="width: 100%"  border>
              <!-- <el-table-column prop="NAME" label="指派人" align="center"></el-table-column> -->
              <el-table-column prop="NAME" label="接收班组长" align="center" width="170px"></el-table-column>
              <el-table-column  label="调度人员" align="center" width="270px">
                <template slot-scope="scope">
                  <el-popover trigger="click" placement="top">
                    <p>{{ scope.row.WORKERNAME }}</p>
                    <div slot="reference" class="name-wrapper">
                      <el-tag effect="dark">{{ scope.row.WORKERNAME }}</el-tag>
                    </div>
                  </el-popover>
                </template>
              </el-table-column>
              <el-table-column label="调度车辆" align="center" width="270px">
                <template slot-scope="scope">
                  <el-popover trigger="click" placement="top">
                    <p>{{ scope.row.CARNAME }}</p>
                    <div slot="reference" class="name-wrapper">
                      <el-tag effect="dark">{{ scope.row.CARNAME }}</el-tag>
                    </div>
                  </el-popover>
                </template>
              </el-table-column>
              <el-table-column  label="指导内容" align="center" width="270px">
                <template slot-scope="scope">
                  <el-popover trigger="click" placement="top" >
                    <p > {{ scope.row.DETAIL }}</p>
                    <div slot="reference" class="name-wrapper">
                      <el-tag effect="dark">{{ scope.row.DETAIL }}</el-tag>
                    </div>
                  </el-popover>
                </template>
              </el-table-column>
              <el-table-column prop="CREATETIME" label="时间" align="center" width="170px"></el-table-column>
              <el-table-column prop="STATUS" label="状态" align="center" width="170px"></el-table-column>
            </el-table>
        </el-tabs>
      </div>
    </el-dialog>
    <!-- 反馈记录 -->
    <el-dialog title="反馈记录" :visible.sync="showRecordVisible">
      <div>
            <el-row :gutter="1">
              <el-col :span="8">
                <el-form ref="form" :model="form" style="float:left">
                  <el-form-item>
                    <el-button size="mini" type="success" @click="handleAdd1">添加指导</el-button>
                  </el-form-item>
                </el-form>
              </el-col>
            </el-row>
          </div>
      <div>
        <el-tabs type="border-card" style="min-height: 350px">
            <el-table :data="rectificationData" style="width: 100%"  border>
              <el-table-column prop="ROADNAME" label="道路名称" align="center" width="210px"></el-table-column>
              <!-- <el-table-column prop="YINSPECTTIME" label="接收班组长" align="center"></el-table-column> -->
              <el-table-column prop="LOCATION" label="位置" align="center" width="270px"></el-table-column>
              <el-table-column label="整改内容" align="center" width="370px">
                <template slot-scope="scope">
                  <el-popover trigger="click" placement="top" >
                    <p > {{ scope.row.REMARK }}</p>
                    <div slot="reference" class="name-wrapper">
                      <el-tag effect="dark">{{ scope.row.REMARK }}</el-tag>
                    </div>
                  </el-popover>
                </template>
              </el-table-column>
              <el-table-column prop="TIME" label="时间" align="center" width="170px"></el-table-column>
              <el-table-column label="图片"  align="center">
                <template slot-scope="scope">
                  <el-image
                    style="width: 40px; height: 40px; margin-top: 12px;"
                    :src="scope.row.PHOTO1"
                    @click="bigImage(scope.row)"
                  ></el-image>
                </template>
              </el-table-column>
               <!-- <el-table-column
                prop="STATUS"
                label="状态"
                align="center"
              ></el-table-column> -->
              <el-table-column label="播放" width="250">
                <template slot-scope="scope">
                  <el-button v-if="scope.row.RecordPath"
                    type="text"
                    icon="el-icon-headset"
                    @click="openRecording(scope.$index, scope.row)"
                    >播放录音</el-button
                  >
                  <el-button v-if="scope.row.VideoPath"
                    type="text"
                    icon="el-icon-video-play"
                    @click="playVideo(scope.$index, scope.row)"
                    >播放视频</el-button
                  >
                </template>
              </el-table-column>
            </el-table>
        </el-tabs>
      </div>
    </el-dialog>

    <!-- 添加指导 -->
    <el-dialog
      :title="addDialogTitle"
      :visible.sync="isVisibleEdit"
      width="50%"
    >
      <el-form ref="form" :model="form" label-width="5.729vw" >
        <el-form-item label="接收班组长：">
              <el-select v-model="form.client" placeholder="请选择" @change="changeClientOptions">
                <el-option
                  v-for="item in clientList"
                  :key="item.VID"
                  :label="item.NAME"
                  :value="item.VID"
                ></el-option>
              </el-select>
            </el-form-item>
        
        <el-form-item label="调度人员：" >
          <el-select v-model="form.team" multiple  placeholder="请选择" collapse-tags @change="selectCar">
                <el-option
                  v-for="item in teamList"
                  :key="item.NAME"
                  :label="item.NAME"
                  :value="item.NAME"
                  
                ></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="调度车辆班组："  >
          <el-select v-model="form.carteam" placeholder="请选择" @change="changeCarClientOptions">
                <el-option
                  v-for="item in carteamList"
                  :key="item.CLIENT_NO"
                  :label="item.CLIENT_NAME"
                  :value="item.CLIENT_NO"
                ></el-option>
              </el-select>
        </el-form-item>
        <el-form-item label="调度车辆："  >
          <el-select
            v-model="form.car"
            placeholder="请选择"
            style="width: 50%"
            multiple 
            collapse-tags
            @change="selectCar"
          >
            <el-option
              v-for="item in carList"
              :key="item.LICENSE_PLATE"
              :label="item.LICENSE_PLATE"
              :value="item.LICENSE_PLATE"
            ></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="指导内容："  style="height: 175px">
          <el-input  type="textarea" :rows="9" v-model="form.guidance" placeholder="请输入" class="handle-input mr10" style="width: 37.5vw;border: 1px solid #a4aca7;" >
          </el-input>
        </el-form-item>
        <el-tag
        :key="tag"
        v-for="tag in dxteam"
        :disable-transitions="false">
       已派遣人员： {{tag}}
      </el-tag>
      <el-tag
        :key="tag"
        v-for="tag in dxcar"
        :disable-transitions="false">
       已派遣车辆： {{tag}}
      </el-tag>
      </el-form>
      
      <span slot="footer" class="dialog-footer">
        <el-button @click="isVisibleEdit = false">取 消</el-button>
        <el-button type="primary" @click="addCommand()">确 定</el-button>
      </span>
    </el-dialog>
    <!-- 添加指导 -->
    <el-dialog
      :title="addDialogTitle"
      :visible.sync="isVisibleEdit1"
      width="50%"
    >
      <el-form ref="form" :model="form" label-width="5.729vw" >
        <el-form-item label="接收班组长：">
              <el-select v-model="form.client" placeholder="请选择" @change="changeClientOptions">
                <el-option
                  v-for="item in clientList"
                  :key="item.VID"
                  :label="item.NAME"
                  :value="item.VID"
                ></el-option>
              </el-select>
            </el-form-item>
        
        <el-form-item label="调度人员：" >
          <el-select v-model="form.team" multiple  placeholder="请选择" collapse-tags @change="selectCar">
                <el-option
                  v-for="item in teamList"
                  :key="item.NAME"
                  :label="item.NAME"
                  :value="item.NAME"
                  
                ></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="调度车辆班组："  >
          <el-select v-model="form.carteam" placeholder="请选择" @change="changeCarClientOptions">
                <el-option
                  v-for="item in carteamList"
                  :key="item.CLIENT_NO"
                  :label="item.CLIENT_NAME"
                  :value="item.CLIENT_NO"
                ></el-option>
              </el-select>
        </el-form-item>
        <el-form-item label="调度车辆："  >
          <el-select
            v-model="form.car"
            placeholder="请选择"
            style="width: 50%"
            multiple 
            collapse-tags
            @change="selectCar"
          >
            <el-option
              v-for="item in carList"
              :key="item.LICENSE_PLATE"
              :label="item.LICENSE_PLATE"
              :value="item.LICENSE_PLATE"
            ></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="指导内容："  style="height: 175px">
          <el-input  type="textarea" :rows="9" v-model="form.guidance" placeholder="请输入" class="handle-input mr10" style="width: 37.5vw;border: 1px solid #a4aca7;" >
          </el-input>
        </el-form-item>
        <el-tag
        :key="tag"
        v-for="tag in dxteam"
        :disable-transitions="false">
       已派遣人员： {{tag}}
      </el-tag>
      <el-tag
        :key="tag"
        v-for="tag in dxcar"
        :disable-transitions="false">
       已派遣车辆： {{tag}}
      </el-tag>
      </el-form>
      
      <span slot="footer" class="dialog-footer">
        <el-button @click="isVisibleEdit = false">取 消</el-button>
        <el-button type="primary" @click="addCommand1()">确 定</el-button>
      </span>
    </el-dialog>
  </div>
</template>
<script>
import '@/assets/css/common.css'
import { formatDate } from '@/common/js/date.js'

import export2Excel from '@/utils/exportExcel/index.js'
import BenzAMRRecorder from 'benz-amr-recorder'
export default {
  data () {

    return {
      currentPage: 1, //初始页
      pageSize: 10,    //    每页的数据
      srcBig: '',
      imageList: [],
      playRec: null,
      videoPath: '',
      showBigDialogVisible: false,
      showVideoDialogVisible: false,
      showRecordVisible: false,
      showGuidanceVisible: false,
      isVisibleEdit: false,
      isVisibleEdit1: false,
      form: {
        groupingList: [],
        groupingValue: '',
        cphList: [],//车牌号列表
        guidance: '',
        alermTypeList: [{ label: '1分钟', value: '1' }, { label: '5分钟', value: '5' }, { label: '10分钟', value: '10' }, { label: '30分钟', value: '30' }],
        alermTypeValue: '5',
        StartDate: formatDate(new Date(new Date() - 3600 * 1000 * 24*30), 'yyyy-MM-dd'),
        EndDate: formatDate(new Date(), 'yyyy-MM-dd 23:59:59'),
        name:"",
        PeopleNumber: '1',
        VehicleNumber: '0',
        team:"",
        car:"",
      },
      client: '',
      clientList: [],
      teamList: [],
      carteam: '',
      carteamList: [],
      carList: [],
      car:[],
      team:[],
      originalData: [],
      tableData: [],
      commandData:[],
      rectificationData:[],
      loading: false,
      URLByTYPE: '',
      // dxlist:[{
      // dxcar: '',
      // dxteam: '',}],
      dxcar: [],
      dxteam: [],
      
    }
  },
  created () {
    this.getTeamList()
    this.getcarTeamList()
  },
  mounted () {
    if (localStorage.getItem('CurrentService') === '001') {
      this.URLByTYPE = 'Vehicle'
    }
    if (localStorage.getItem('CurrentService') === '003') {
      this.URLByTYPE = 'RubbishVehicle'
    }
    this.getlistdata()
    // this.getcommandData()
    // this.getGroupingList()
  },
  methods: {
    // 获取班组长
    async getTeamList () {
      const { data } = await this.$Http.get('/DataListCompany/GetTeamLeaderListApi?ClientNo=' + localStorage.getItem('CLIENT_NO'))
      this.clientList = data
    },
    // 获取环卫工
    async changeClientOptions () {
      var screeningData = this.clientList.filter(item => item.VID === this.form.client)
      const { data } = await this.$Http.get('/DataListCompany/GetWorkerListApi?ClientNo=' + screeningData[0].CLIENT_NO)
      this.teamList = data
      // }
    },
    // 获取车辆班组
    async getcarTeamList () {
      const { data } = await this.$Http.get('/RubbishVehicle/GetGroupList?ClientNo=' + localStorage.getItem('CLIENT_NO'))
      this.carteamList = data
    },
    // 获取车辆
    async changeCarClientOptions () {
      const { data } = await this.$Http.get('/RubbishVehicle/GetVehicleCarListSelect?ClientNo=' + this.form.carteam)
      this.carList = data
      // }
    },
    // 获取指导记录
    async getcommandData () {
      const { data } = await this.$Http.get('Worker/GetCommandList?ID='+ this.form.ID)
      this.originalData = data
      this.screeningData()
    },
    // 获取反馈记录
    async getrectificationData () {
      const { data } = await this.$Http.get('Worker/GetProblemList?ParentID='+ this.form.ID)
      this.rectificationData = data
    },
    // 指导记录查询
    screeningData(){
      this.currentPage = 1;
      this.commandData = this.originalData
      console.log(this.commandData)
      if (this.form.name) this.commandData = this.commandData.filter(item => item.NAME.includes(this.form.name))
    },
    async getlistdata () {
      this.currentPage = 1;
      this.loading = true
      var url = 'Worker/GetFeedbackInfo2?ClientNo=' + localStorage.getItem('CLIENT_NO') + '&StartDate=' + this.form.StartDate + '&EndDate=' + this.form.EndDate
      // var url = 'Worker/GetFeedbackInfoNew?ClientNo=' + localStorage.getItem('CLIENT_NO') + '&StartDate=' + this.form.StartDate + '&EndDate=' + this.form.EndDate
      const { data } = await this.$Http.get(url)
      // 原始数据
      this.tableData = data
      // this.tableData = [{ "ID": "67", "CLIENT_NO": "00000040101", "ORIENTATION_TIME": "2020/1/3 11:10:56", "ROADNAME": "吴庄北二街", "LOCATION": "中国天津市西青区华天道118号", "DETAIL": "测试", "PHOTO1": "http://photo-srw-hb2.oss-cn-beijing.aliyuncs.com/fk-Android-1兰浩IMG_20200103_111000.jpg", "PHOTO2": "", "PHOTO3": "", "PHOTO4": "", "PHOTO5": "", "PHOTO6": "", "PHOTO7": "", "PHOTO8": "", "PHOTO9": "", "Lng": "117.111792307646", "Lat": "39.0944252657748", "RecordPath": "http://photo-srw-hb2.oss-cn-beijing.aliyuncs.com/20200103_110854.amr", "VideoPath": "http://photo-srw-hb2.oss-cn-beijing.aliyuncs.com/20200103_110900.3gp", "LONGITUDE": 0.0, "LATITUDE": 0.0, "DIRECTION": null }, { "ID": "66", "CLIENT_NO": "00000040102", "ORIENTATION_TIME": "2020/1/2 15:09:16", "ROADNAME": "测试1", "LOCATION": "中国天津市西青区楚雄西道", "DETAIL": "嗯", "PHOTO1": "http://photo-srw-hb2.oss-cn-beijing.aliyuncs.com/fk-Android-1勾志超IMG_20200102_150907.jpg", "PHOTO2": "", "PHOTO3": "", "PHOTO4": "", "PHOTO5": "", "PHOTO6": "", "PHOTO7": "", "PHOTO8": "", "PHOTO9": "", "Lng": "117.108534794014", "Lat": "39.1010641181183", "RecordPath": null, "VideoPath": null, "LONGITUDE": 0.0, "LATITUDE": 0.0, "DIRECTION": null }, { "ID": "65", "CLIENT_NO": "00000040101", "ORIENTATION_TIME": "2020/1/2 14:46:59", "ROADNAME": "吴庄二路北", "LOCATION": "中国天津市西青区华天道5号", "DETAIL": "行行行", "PHOTO1": "http://photo-srw-hb2.oss-cn-beijing.aliyuncs.com/fk-Android-2兰浩IMG_20200102_144145.jpg", "PHOTO2": "http://photo-srw-hb2.oss-cn-beijing.aliyuncs.com/fk-Android-1兰浩IMG_20200102_144145.jpg", "PHOTO3": "", "PHOTO4": "", "PHOTO5": "", "PHOTO6": "", "PHOTO7": "", "PHOTO8": "", "PHOTO9": "", "Lng": "117.111588381572", "Lat": "39.0941872627973", "RecordPath": null, "VideoPath": null, "LONGITUDE": 0.0, "LATITUDE": 0.0, "DIRECTION": null }, { "ID": "64", "CLIENT_NO": "00000040101", "ORIENTATION_TIME": "2020/1/2 14:46:49", "ROADNAME": "吴庄二路北", "LOCATION": "中国天津市西青区华天道5号", "DETAIL": "行行行", "PHOTO1": "http://photo-srw-hb2.oss-cn-beijing.aliyuncs.com/fk-Android-2兰浩IMG_20200102_144145.jpg", "PHOTO2": "http://photo-srw-hb2.oss-cn-beijing.aliyuncs.com/fk-Android-1兰浩IMG_20200102_144145.jpg", "PHOTO3": "", "PHOTO4": "", "PHOTO5": "", "PHOTO6": "", "PHOTO7": "", "PHOTO8": "", "PHOTO9": "", "Lng": "117.111588381572", "Lat": "39.0941872627973", "RecordPath": null, "VideoPath": null, "LONGITUDE": 0.0, "LATITUDE": 0.0, "DIRECTION": null }]
      this.loading = false
    },
    // 导出Excel
    // exportExcel () {
    //   let excelName = '移动状态信息表'
    //   const tHeader = ['车辆ID', '车辆名称', '车辆分组', '车辆类型', '移动状态', '移动时间', '开始移动时间', '最后移动时间']
    //   const filterVal = ['VID', 'LICENSE_PLATE', 'CAR_TYPE', 'CLIENT_NAME', 'IsRun', 'RunTime', 'BEGINDATE', 'ENDDATE']
    //   export2Excel(tHeader, filterVal, this.tableData, excelName)
    // },
    // 放大图片
    bigImage (row) {
      // this.srcBig = row.PHOTO1
      this.imageList = []
      if (row.PHOTO1 != '') {
        this.imageList.push(row.PHOTO1)
      }
      if (row.PHOTO2 != '') {
        this.imageList.push(row.PHOTO2)
      }
      if (row.PHOTO3 != '') {
        this.imageList.push(row.PHOTO3)
      }
      if (row.PHOTO4 != '') {
        this.imageList.push(row.PHOTO4)
      }
      if (row.PHOTO5 != '') {
        this.imageList.push(row.PHOTO5)
      }
      if (row.PHOTO6 != '') {
        this.imageList.push(row.PHOTO6)
      }
      if (row.PHOTO7 != '') {
        this.imageList.push(row.PHOTO7)
      }
      if (row.PHOTO8 != '') {
        this.imageList.push(row.PHOTO8)
      }
      if (row.PHOTO9 != '') {
        this.imageList.push(row.PHOTO9)
      }
      this.showBigDialogVisible = true
    },
    playRecord (index, row) {
      var recordPath = row.RecordPath
      var player = $('<amr src="' + recordPath + '"  crossOrigin="anonymous"></amr>')
      player = new amrEvent($(player));
      player && player.play(function (playing) {
        console.log("current player playing ?? " + playing)
      })
    },
    //播放语音
    openRecording (index, row) {
      let url = row.RecordPath
      // let url = _url.split('.com')[1]
      let vm = this
      if (vm.playRec !== null) {
        vm.stopPlayVoice()
      }
      vm.playRec = new BenzAMRRecorder()
      //⚠️注意跨域问题
      vm.playRec.initWithUrl('/record' + url).then(function () {
        vm.voiceActive = index
        vm.playRec.play()
        vm.playRec.onEnded(function () {
          vm.voiceActive = null
        })
      }).catch((e) => {
        console.log(e)
        vm.$message.error('播放录音失败')
      })
    },
    //停止播放
    stopPlayVoice () {
      if (this.playRec.isPlaying()) {
        this.playRec.stop()
      }
    },
    playVideo (index, row) {
      if (row.VideoPath != '' && row.VideoPath != null) {
        this.videoPath = row.VideoPath
        this.showVideoDialogVisible = true;
      } else {
        this.$message.error('未上传视频')
      }

    },
    // 分页导航
    handlePageChange (currentPage) {
      this.currentPage = currentPage;
      // console.log(this.currentPage)
      // this.$set(this.query, 'pageIndex', val);
      // this.getData();
    },
    handleSizeChange (size) {
      this.pageSize = size;
      console.log(this.pageSize)
    },
    
    // 打开反馈记录
    rectificationRecord (index,row) {
      this.form = Object.assign({},this.form, row);
      this.showRecordVisible = true
      this.getrectificationData()
    },
    // 打开指导记录
    guidanceRecord (index,row) {
      this.form = Object.assign({},this.form, row);
      this.showGuidanceVisible = true
      this.getcommandData()
    },
    // 打开添加指导窗口
    handleAdd (index, row) {
      this.form = Object.assign({}, row);
      this.dxcar =  Object.assign([]);
      this.dxteam =  Object.assign([]);
      this.addDialogTitle = '资源调度与过程指导'
      //展示窗口
      this.isVisibleEdit = true;
      // this.idEdit = false;
    },
    // 下发指导
    async addCommand () {
      var carset = this.form.car.join(",");
      var workerset = this.form.team.join(",");
      const params = {
        ID: this.form.ID,
        TOVID: this.form.client,
        DETAIL: this.form.guidance,
        WORKERNAME: workerset,
        CARNAME: carset,
      }
      console.log('下发指令：')
      console.log(params)
      const { data } = await this.$Http.get('Worker/AddCommand', { params })
      if (data.IsSucess) {
        this.$message.success('下发指导成功')
        this.isVisibleEdit = false
      } else {
        this.$message.error('下发指导成功失败');
      }
    },
     // 打开添加指导窗口
    handleAdd1 (index, row) {
      this.form = Object.assign({}, row);
      this.dxcar =  Object.assign([]);
      this.dxteam =  Object.assign([]);
      this.addDialogTitle = '资源调度与过程指导'
      //展示窗口
      this.isVisibleEdit1 = true;
      // this.idEdit = false;
    },
    // 下发指导
    async addCommand1 () {
        this.$message.success('下发指导成功')
        this.isVisibleEdit1 = false
    },
    // 选择某一个下拉框
    selectCar(){
      // this.dxlist.dxteam =  this.form.team
      // this.dxlist.dxcar =  this.form.car
      this.dxteam =  this.form.team
      this.dxcar =  this.form.car
    },
  }
}
</script>
<style>
.content {
  overflow-y: scroll;
}
.el-col-6 {
  width: 350px;
  min-height: 50px;
}
.el-table th {
  height: 40px;
}
.el-form-item label {
  width: 80px;
}

</style>